<template>
  <div>
    <el-dialog :title="title" v-model="compontOpen" :width="compontWidth ? compontWidth + 'px' : '500px'" :append-to-body="appendToBody">
      <slot name="content"></slot>
      <template #footer>
        <span class="dialog-footer">
          <slot name="confirm"></slot>
          <el-button @click="compontOpen = false">取 消</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>

<script lang="ts" setup>
import { type IDiologP } from "../index";
withDefaults(defineProps<IDiologP>(), {
  title: "",
  componWidth: "80%"
});
const compontOpen = ref(false);
type IDiologEx = {
  compontOpen: Ref<boolean>;
};
let diologEx: IDiologEx = { compontOpen };
defineExpose({ ...diologEx });
</script>

<style scoped></style>
